Page({
  data: {
    allCardList: [], // 存放所有卡片
    selectedCardList: [], // 存放已选中的卡片
    currentSelectedCard: {}, // 当前选中的卡片
    selectHistory: [], // 选中的历史记录
    iconList: [
      { picIndex: 0, icon: '/pages/image/yang/sheep1.png' },
      { picIndex: 1, icon: '/pages/image/yang/sheep2.png' },
      { picIndex: 2, icon: '/pages/image/yang/sheep3.png' },
      { picIndex: 3, icon: '/pages/image/yang/sheep4.png' },
      { picIndex: 4, icon: '/pages/image/yang/sheep1.png' },
      { picIndex: 5, icon: '/pages/image/yang/sheep2.png' },
      { picIndex: 6, icon: '/pages/image/yang/sheep3.png' },
      { picIndex: 7, icon: '/pages/image/yang/sheep4.png' },
      { picIndex: 8, icon: '/pages/image/yang/sheep2.png' },
      { picIndex: 9, icon: '/pages/image/yang/sheep1.png' },
      { picIndex: 10, icon: '/pages/image/yang/sheep3.png' }
    ],
    positionList: [] // 存放卡片的绝对位置
  },

  onLoad: function () {
    this.initData();
  },

  // 点击卡片时触发的函数
  selectedCard: function (event) {
    const index = event.currentTarget.dataset.index;
    const item = this.data.allCardList[index];
    const isHover = this.hasOverLayer(event.target);
    
    if (!isHover) {
      let selectedCardList = [...this.data.selectedCardList, item];
      selectedCardList.sort((a, b) => a.picIndex - b.picIndex);
      
      this.setData({
        selectedCardList: selectedCardList,
        currentSelectedCard: item,
        allCardList: this.data.allCardList.filter((_, i) => i !== index),
        selectHistory: [...this.data.selectHistory, item]
      });

      setTimeout(() => {
        this.checkRemove();
        if (this.data.allCardList.length === 0) {
          this.open1();
        }
        if (this.data.selectedCardList.length >= 7) {
          this.open();
          this.initData();
        }
      }, 200);
    }
  },

  // 检查是否有重复的卡片
  checkRemove: function () {
    let num = this.data.selectedCardList.filter(item => item.icon === this.data.currentSelectedCard.icon).length;
    if (num === 3) {
      let newSelectedCardList = this.data.selectedCardList.filter(item => item.icon !== this.data.currentSelectedCard.icon);
      let newSelectHistory = this.data.selectHistory.filter(item => item.icon !== this.data.currentSelectedCard.icon);
      this.setData({
        selectedCardList: newSelectedCardList,
        selectHistory: newSelectHistory
      });
    }
  },

  // 判断卡片是否被覆盖
  hasOverLayer: function (element) {
    const rect = element.getBoundingClientRect();
    const x = rect.x, y = rect.y, width = rect.width, height = rect.height;

    const elements = [
      document.elementFromPoint(x + 1, y + 1),
      document.elementFromPoint(x + width - 1, y + 1),
      document.elementFromPoint(x + 1, y + height - 1),
      document.elementFromPoint(x + width - 1, y + height - 1)
    ];
    
    return elements.filter(el => el !== null).some(el => el !== element && !element.contains(el));
  },

  // 初始化卡片数据
  initData: function () {
    this.setData({
      allCardList: [],
      selectedCardList: [],
      selectHistory: [],
      positionList: []
    });

    // 初始化卡片位置
    this.createIcon();
  },

  // 创建卡片
  createIcon: function () {
    let index = 0;
    let random = 0;
    let allCardList = [];
    
    // 创建卡片数据
    for (let i = 0; i < 30; i++) {
      if (i % 3 === 0) {
        random = Math.floor(Math.random() * 11);
      }
      allCardList.push({
        id: index++,
        icon: this.data.iconList[random].icon,
        picIndex: this.data.iconList[random].picIndex
      });
    }

    // 打乱卡片顺序
    allCardList = allCardList.sort(() => Math.random() > 0.5 ? 1 : -1);
    allCardList.forEach((item, index) => item.id = index);
    this.setData({
      allCardList: allCardList
    });

    // 初始化卡片位置
    this.initCardPosition();
  },

  // 初始化卡片的定位
  initCardPosition: function () {
    let positionList = [];
    const cardSize = 100; // 假设每个卡片的尺寸是100x100px
    const cardMargin = 10; // 卡片之间的间隔
    const cardsPerRow = 5; // 每行显示5个卡片

    // 计算卡片位置
    this.data.allCardList.forEach((item, index) => {
      const row = Math.floor(index / cardsPerRow); // 计算行号
      const col = index % cardsPerRow; // 计算列号
      positionList.push({
        id: item.id,
        left: col * (cardSize + cardMargin) + 'px', // 计算左偏移
        top: row * (cardSize + cardMargin) + 'px' // 计算顶部偏移
      });
    });

    this.setData({
      positionList: positionList
    });
  }
});
